<!-- 设置 -->
<template>
  <view class="set-wrap">
    <!-- cell -->
    <view class="set-box">
      <u-cell-group class="menu-list-box">
        <u-cell-item class="menu-item" title="意见反馈" :titleStyle="{ color: '#333', fontSize: '28rpx' }"
          @tap="$Router.push('/pages/public/feedbackList')"></u-cell-item>
        <!-- <u-cell-item class="menu-item" title="地址管理" :titleStyle="{ color: '#333', fontSize: '28rpx' }"
					@tap="$Router.push('/pages/user/address/list')"></u-cell-item> -->
        <u-cell-item class="menu-item" title="修改登录密码" :titleStyle="{ color: '#333', fontSize: '28rpx' }"
          @tap="$Router.push('/pages/user/password')"></u-cell-item>
        <u-cell-item class="menu-item" title="修改支付密码" :titleStyle="{ color: '#333', fontSize: '28rpx' }"
          @tap="$Router.push('/pages/user/paypassword')"></u-cell-item>
        <u-cell-item class="menu-item" title="占用缓存" :titleStyle="{ color: '#333' }" :value="storageSize"
          :value-style="{ color: '#999' }"></u-cell-item>
        <!-- <u-cell-item class="menu-item" title="当前版本" :titleStyle="{ color: '#333' }" :value="shop.version"
					:value-style="{ color: '#999' }"></u-cell-item> -->

        <u-cell-item class="menu-item" title="关于我们" :titleStyle="{ color: '#333', fontSize: '28rpx' }"
          @tap="torich(3)"></u-cell-item>
        <u-cell-item class="menu-item" title="隐私协议" :titleStyle="{ color: '#333', fontSize: '28rpx' }"
          @tap="torich(1)"></u-cell-item>
      </u-cell-group>
    </view>

    <view class="btn-box u-flex u-row-center u-col-center" v-show="this.token">
      <button hover-class="hover-logout-btn" class="u-reset-button logout-btn" @tap="showModal = true">退出登录</button>
    </view>
    <u-modal ref="uModal" v-model="showModal" :show-cancel-button="true" confirm-color="#F54141" cancel-color="#666666"
      @confirm="confirmLogOut" content="确定退出登录？"></u-modal>
    <!-- 登录提示 -->
    <shopro-auth-modal></shopro-auth-modal>
  </view>
</template>

<script>
  import {
    mapState,
    mapActions
  } from 'vuex';
  export default {
    components: {},
    data() {
      return {
        token: '',
        showModal: false,
        storageSize: uni.getStorageInfoSync().currentSize + 'Kb'
      };
    },
    computed: {
      ...mapState({
        shop: ({
          shopro
        }) => shopro.config.shop //初始化数据
      })
    },
    methods: {
      ...mapActions(['logout']),
      // 退出登录
      confirmLogOut() {
        this.logout();
        this.$Router.back();
      },
      torich(id){
        console.log(id)
        uni.navigateTo({
          url:'/pages/public/richtext?id=' + id
        })
      }
    },
    created() {
      this.token = uni.getStorageSync('token');
    }
  };
</script>

<style lang="scss">
  .set-box {
    background-color: #fff;
  }

  .logo-box {
    padding: 110rpx 0;

    .app-name {
      font-size: 36rpx;
      font-weight: 600;
      color: #333333;
    }
  }

  .copyright-box {
    .copyright-text {
      font-size: 22rpx;
      font-weight: 500;
      color: #c4c4c4;
    }
  }

  .btn-box {
    margin-top: 50rpx;

    .logout-btn {
      width: 400rpx;
      height: 80rpx;
      line-height: 80rpx;
      border: 1rpx solid #f54141;
      border-radius: 40rpx;
      font-size: 30rpx;
      font-weight: 500;
      color: #f54141;
    }

    .hover-logout-btn {
      width: 400rpx;
      height: 80rpx;
      background: #f54141;
      border: 1rpx solid #f54141;
      border-radius: 40rpx;
      font-size: 30rpx;
      font-weight: 500;
      color: #ffffff;
    }
  }
</style>
